<template>
    <el-aside class="nav-menu" style="width:170px;height:100%">
            <el-menu :default-active="active" class="el-menu-vertical-demo" @select="onSelectMenu" >
                <el-submenu index="1">
                    <template #title>
                        <i class="el-icon-location"></i>
                        <span>导航一</span>
                    </template>
                    <el-menu-item-group>
                        <el-menu-item index="MActivity">选项1</el-menu-item>
                        <el-menu-item index="Timedtask">选项2</el-menu-item>
                    </el-menu-item-group>
   
                </el-submenu>
                <el-menu-item index="2">
                    <i class="el-icon-menu"></i>
                    <template #title>导航二</template>
                </el-menu-item>
            </el-menu>
    </el-aside>
</template>

<script lang="ts">
import { defineComponent,getCurrentInstance } from 'vue';

export default defineComponent({
    setup(){
        const instance: any = getCurrentInstance();
        const GL = instance.appContext.config.globalProperties;
        const active = GL.$route.meta.menu;
        const onSelectMenu = (name: string) =>{
            GL.$router.push({name})
        }
        return{
            active,
            onSelectMenu
        }  
    }
});
</script>

<style lang="scss" scoped>
@import 'index.scss';
</style>
